/**
 * Created by home on 2018/1/16.
 */

var vm = new Vue({
    el:'.row_guides',
    data:{
        page: 1,
        size: 6,
        qiniu:'http://ovc3poav6.bkt.clouddn.com/',
        guideList: [],
        features:[],
        sampleGuidesData:[{
            name:'莎莎莎',
            price:'88',
            features:'大胆 聪敏 内敛',
            description:'爱好唱歌跳舞'
            },{
            name:'莎莎莎',
            price:'88',
            features:'大胆 聪敏 内敛',
            description:'爱好唱歌跳舞'
        }],
        test:'hello'
    },
    methods: {
        getGuides: function () {
            // vue 异步时无法识别 this
            var that = this

            $.ajax({
                url:"?r=home/guides",
                type:"GET",
                success:function(response){
                    var result =  JSON.parse(response)

                    var data = result['data']

                    for (var i = 0; i < data.length; i++)
                    {
                        var index = data[i].hourly_rate.indexOf('.')
                        data[i].hourly_rate = data[i].hourly_rate.substr(0,index);
                        data[i].portrait = data[i].portrait+'?imageView2/0/w/447/h/330';
                        that.features =  data[i].features.split(" ")
                        data[i].features = data[i].features.split(" ")
// debugger
                    }

                    that.guideList = data

                }
            });

        }
    }
})
vm.getGuides()
// alert('hello')
//    <!--修改轮播图-->
var mySwiper = new Swiper('.row1 .swiper-container', {
    loop: true,

    // 如果需要分页器
    pagination: '.row1 .swiper-pagination',

    // 如果需要前进后退按钮
    nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',

    autoplay:3000,

    speed:1000,

    paginationClickable :true,
})
//   多图轮播
var mySwiper1 = new Swiper('.business_row .swiper-container', {
    //direction: 'vertical',
    spaceBetween: 30,
    loop: false,
    slidesPerView:3,

    autoplay:3000,

    speed:1000,

    paginationClickable :true,
})
$("#pre").click(function () {
    mySwiper1.slidePrev()
})
$("#next").click(function () {
    mySwiper1.slideNext()
})

//     放大效果
$('.pre_item').on("mouseover mouseout",function(event){
    if(event.type == "mouseover"){
        //鼠标悬浮
        $(this).css({'border-left':'1px solid #498fca','height':'200px'})
        $(this).children('small').css('display','block')

    }else if(event.type == "mouseout"){
        //鼠标离开
        $(this).css({'border-left':'none','height':'120px'})
        $(this).children('small').css('display','none')
    }
})
// 视频播放
$("#video_bg1").hide();
//    隐藏maskView
$(document).ready(function () {

    $("#play1").click(function () {
        $("#maskView1").hide()
        $("#video_bg1").show();
        //   视频自动播放
        var myPlayer = videojs('my-video1');
        videojs("my-video1").ready(function(){
            var myPlayer = this;
            myPlayer.play();
        });
    })
})
//    视频播放结束
function videoEnd1() {
    $("#video_bg1").hide();
    $("#maskView1").show();
}
$("#video_bg1").hide();

//    隐藏maskView
$(document).ready(function () {

    $("#play2").click(function () {
        $("#maskView2").hide()
        $("#video_bg2").show();
        //   视频自动播放
        var myPlayer = videojs('my-video2');
        videojs("my-video").ready(function(){
            var myPlayer = this;
            myPlayer.play();
        });
    })
})
//    视频播放结束
function videoEnd2() {
    $("#video_bg2").hide();
    $("#maskView2").show();
}
$("#video_bg2").hide();